<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>搜索框提示</title>
		<style>
			*{
				list-style: none;
				padding: 0px;
				margin: 0px;
			}
			#div1{
				margin-left: 30%;
			}
			#div1 input{
				width: 430px;
				height: 30px;
			}
			#div1 div{
				width: 434px;
				height: auto;
			}
			#div1 div ul li:nth-child(1){
				width: 432px;
				height: auto;
				background: gainsboro;
				border: solid gray 1px;
			}
			#div1 div ul li{
				width: 432px;
				height: auto;
				background: white;
				border: solid gray 1px;
			}
		</style>
	</head>
	<body>
		<div id="div1">
			<input type="text" value="搜索..."/>
			<div>
				<ul>
					<li><strong>A</strong></li>
					<li><strong>Adele</strong></li>
					<li><strong>Agnes</strong></li>
				</ul>
			</div>
			<div>
				<ul>
					<li><strong>B</strong></li>
					<li><strong>Billy</strong></li>
					<li><strong>Bob</strong></li>
				</ul>
			</div>
			<div>
				<ul>
					<li><strong>C</strong></li>
					<li><strong>Calvin</strong></li>
					<li><strong>Christina</strong></li>
					<li><strong>Cindy</strong></li>
				</ul>
			</div>
		</div>
		<script>
			
		</script>
	</body>
</html>
